<div style="padding: 20px;">
<h2 class="mb20">
    {%$day%}报表{%notempty name="id"%}&nbsp;&nbsp;&nbsp;(id={%$id%}){%/notempty%}
</h2>
<div id="placeholder_day" class="mb10" style="height:400px;"></div>
<div class="center mb20" id="choices">对比：</div>

<ul class="nav nav-tabs mb20" id="_tabs_day">
    <!--{%foreach name="labelData" item="data"%}-->
    <li class='{%empty name="start"%}active{%/empty%}'><a href="javascript:;">{%$data[0]%}</a></li>
    <!--{%php%}$start=1;{%/php%}-->
    <!--{%/foreach%}-->
</ul>
<!--{%foreach name="labelData" item="data"%}-->
<div class="fn_tab_content_day" style='{%notempty name="start2"%}display: none;{%/notempty%}'>
<table class="table table-listing table-hovered">
    <thead class="thead-gray">
    <tr>
        <th>日期</th>
        <th>数量</th>
    </tr>
    </thead>
    <tbody>
    {%notempty name="data[1]"%}
    {%php%}$all = 0;{%/php%}
    {%foreach name="data[1]" item="vo"%}
    <tr>
        <td>{%$vo.day_h%}</td>
        <td>{%$vo.num%}</td>
    </tr>
    {%php%}$all += $vo['num'];{%/php%}
    {%/foreach%}
    <tr>
        <td></td>
        <td>合计:{%$all%}</td>
    </tr>
    {%/notempty%}
    </tbody>
</table>
</div>
<!--{%php%}$start2=1;{%/php%}-->
<!--{%/foreach%}-->
</div>

<script>
    new ST.Tabs({
        ts:'#_tabs_day',
        el:'li',
        curClass:'active',
        evType:"click",
        sfun:function(node,i){
            var conts = $('.fn_tab_content_day');
            conts.hide().eq(i).show();
        }
    });
    var data, labelData = [];
    <!--{%foreach name="labelData" item="data"%}-->
    data = [];
    <!--{%foreach name="data[1]" item="vo"%}-->
    data.push(["{%$vo.day_h%}", '{%$vo.num%}']);
    <!--{%/foreach%}-->
    labelData.push({label: "{%$data[0]%}", data: data});
    <!--{%/foreach%}-->

    var i = 0;
    $.each(labelData, function(key, val) {
        val.color = i;
        ++i;
    });

    var plotObj = ST.plotChart('#placeholder_day', labelData, 'day');

    var choiceContainer = $("#choices");
    $.each(labelData, function(key, val) {
        choiceContainer.append('<label><input type="checkbox" value="' + key +'" checked="checked" />' + val.label + '</label>&nbsp;&nbsp;&nbsp;');
    });
    choiceContainer.find("input").click(function() {
        var newData = [];
        choiceContainer.find("input:checked").each(function () {
            var key = $(this).val();
            if (labelData[key]) {
                newData.push(labelData[key]);
            }
        });
        if (newData.length > 0) {
            plotObj.setData(newData);
            plotObj.draw();
        }
    });

    ST.init();
</script>